/*
* @Author: zhangsai
* @Date: 2018/2/26
* @Last Modified by: zhangsai
* @Last Modified time: 2018/2/26
* @description: 文件icon
*/
<template>
    <div style="display: inline-block">
        <i class="fa ca-icon--type" :class="getFileIconName"></i>
    </div>
</template>

<script type="text/ecmascript-6">

    export default {
        name: 'tzIconFileType',
        data() {
            return {
                iconList: {
                    'doc': 'fa-file-word-o',
                    'docx': 'fa-file-word-o',
                    'pdf': 'fa-file-pdf-o',
                    'xls': 'fa-file-excel-o',
                    'xlsx': 'fa-file-excel-o',
                    'image': 'fa-file-image-o',
                    //图片文件  bmp gif jpg jpeg jpe png tif tiff pic
                    'bmp': 'fa-file-image-o',
                    'gif': 'fa-file-image-o',
                    'jpg': 'fa-file-image-o',
                    'jpeg': 'fa-file-image-o',
                    'jpe': 'fa-file-image-o',
                    'png': 'fa-file-image-o',
                    'tif': 'fa-file-image-o',
                    'tiff': 'fa-file-image-o',
                    'pic': 'fa-file-image-o',
                    //music
                    'mp3': 'fa-music',

                    'text': 'fa-file-text',
                    'txt': 'fa-file-text',
                    'zip': 'fa-file-zip-o',
                    'rar': 'fa-file-zip-o',
                    'ppt': 'fa-file-powerpoint-o',
                    'pptx': 'fa-file-powerpoint-o',
                }
            }
        },
        computed: {
            // a computed getter
            getFileIconName: function () {
                if (!this.fileType) {
                    return '';
                }
                var fileList = this.fileType.split('.');
                var type = fileList[fileList.length - 1].toLowerCase();
                return this.iconList[type] ? this.iconList[type] : 'fa-file-o';
            }
        },
        props: {
            fileType: {
                type: String,
                default: ''
            }
        },

    }
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
    .ca-icon--type {
        font-size: 26px;
        color: #717171;
    }
</style>
